<template>
  <div id="detail">
    <h2>{{detailInfo.title}}</h2>
    <div class="img-wrap">
      <img :src="detailInfo.thumb_imgae_file" alt />
    </div>
    <p class="content" v-html="detailInfo.content"></p>
  </div>
</template>

<script>
import https from "@/https";
import config from "@/config";
export default {
  data() {
    return {
      detailInfo: {}
    };
  },
  methods: {
    getDetail(id) {
      let params = {
        id
      };
      https
        .fetchPost(config.newInfo, params)
        .then(res => {
          console.log(res.data);
          if (res.data.code == 1) {
            let info = res.data.data;
            let name = "https://g.sqyzdh.com";
            info.thumb_imgae_file = name + info.thumb_imgae_file;
            this.detailInfo = info;
          } else {
            Toast.failed(res.data.msg);
          }
        })
        .catch(err => {
          console.log(err);
        });
    }
  },
  created() {
    let id = this.$route.query.id;
    this.getDetail(id);
  }
};
</script>

<style lang="scss" scoped>
#detail {
  padding: 60px 40px 30px;
  h2 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 40px;
    text-align: center;
  }
  .img-wrap {
    display: flex;
    justify-content: center;
    overflow: hidden;
    height: 300px;
    margin-bottom: 50px;
    img {
      height: 300px;
    }
  }
  .content {
    font-size: 28px;
    color: #666;
    text-indent: 2em;
    line-height: 1.5em;
  }
}
</style>
